

<template>
  <el-dialog title="选择工作网卡"  v-model="show">
    <el-table :data="list" ref="tableRef" @current-change="currentChange" row-class-name="row-table" border highlight-current-row style="width: 100%">
      <el-table-column prop="ip" label="ip" />
      <el-table-column prop="name" label="name" />
    </el-table>
    <template #footer>
      <span class="dialog-footer">
        <el-button @click="selectIp">确认</el-button>
      </span>
    </template>
  </el-dialog>
</template>


<script setup>
  import { ref, reactive, onMounted } from 'vue'
  defineProps({
    list: Array,
    ip: String,
    show: Boolean
  })

  const form = reactive({
    ip: '',
    name: ''
  })


  let tableRef = ref(null) //核心

  onMounted(() => {
    console.log(tableRef.value)
    // tableRef.value.setCurrentRow(1)
  })
  const emits = defineEmits(['submit']);
  function selectIp() {
    if (!form.ip) {
      alert("请选择")
    }
    emits('submit', { ip: form.ip, name: form.name})
  }

  function currentChange(row){
    console.log(row)
    form.ip = row.ip
    form.name = row.name
  }

  

</script>

<style scoped>
a {
  color: #42b983;
}
</style>
